<template>
	<view class="app_Cont">
		<view class="showCont" v-if="showCont">
			<view class="headCont">
				<view class="schoolCont">
					<view class="schoolImg">
						<image :src="formData.school_logo" /></image>
					</view>
					<view class="schoolInfo">
						<view class="schoolName">
							<view>{{formData.name}}({{formData.mobile}})</view>
							<view class="accountTag" v-if="formData.status==2">禁用</view>
						</view>
						<view class="schoolText">{{formData.school_name}}</view>
					</view>
					<view class="editBtn iconfont icon-bianji" v-if="formData.account_type==1" @click="accountFn"></view>
				</view>
				<view class="cardCont">
					<view class="cardItem">
						<view class="cardNum">{{formData.ljhx_sum}}</view>
						<view class="cardName">累计核销</view>
					</view>
					<view class="cardItem">
						<view class="cardNum">{{formData.wdhx_sum}}</view>
						<view class="cardName">我的核销</view>
					</view>
				</view>
				<view class="subBtn" @click="subFn">
					<text class="iconfont icon-saoyisao"></text>
					<text>扫码核销</text>
				</view>
			</view>
			<view class="recordCont">
				<view class="recordHead">
					<view class="recordTitle">近期核销记录</view>
					<view class="recordMore" @click="moreFn">更多</view>
				</view>
				<view class="recordList">
					<view :class="index==0?'workItem noTop':'workItem'" @click="detailFn(item)" :key="index" v-for="(item,index) in listArr">
						<view class="workHead">
							<view class="workName">{{item.training_name}}</view>
							<view class="workDes">{{item.sign_number}}</view>
						</view>
						<view class="workInfo">
							<view class="infoItem">
								<view class="infoName">学员姓名</view>
								<view class="infoText">{{item.real_name}}</view>
							</view>
							<view class="infoItem">
								<view class="infoName">核销人员</view>
								<view class="infoText">{{item.school_admin_name}}</view>
							</view>
							<view class="infoItem">
								<view class="infoName">核销时间</view>
								<view class="infoText">{{item.create_time}}</view>
							</view>
						</view>
					</view>
					<noData v-if="listArr.length==0"></noData>
				</view>
			</view>
		</view>
		<u-popup :show="showCodeMask"  :safeAreaInsetBottom="false" mode="bottom" :round="10">
			<view class="formCont">
				<view class="formTitle">{{codeInfo.training_content.training_name}}</view>
				<view class="formDesItem">
					<view class="desName">订单编号</view>
					<view class="desText">{{codeInfo.sign_number}}</view>
				</view>
				<view class="formDesItem">
					<view class="desName">学员信息</view>
					<view class="desText">{{codeInfo.real_name}}（{{codeInfo.mobile}}）</view>
				</view>
				<view class="formDesItem">
					<view class="desName">身份证号</view>
					<view class="desText">{{codeInfo.id_card}}</view>
				</view>
				<view class="formDesItem">
					<view class="desName">已付定金</view>
					<view class="desText">¥ {{codeInfo.pay_money}}</view>
				</view>
				<view class="formDesItem">
					<view class="desName">总培训费</view>
					<view class="desText">¥ {{codeInfo.total_money}}</view>
				</view>
				<view class="ctrlGroup">
					<view @click="showCodeMask = false"  class="ctrlBtn">取消核销</view>
					<view class="ctrlBtn has_bg" @click="sureCodeFn">确认核销</view>
				</view>
			</view>
		</u-popup>
		<load v-if="!showCont"></load>
		<u-toast ref="uToast"></u-toast>
		<subLoad v-if="showSub"></subLoad>
	</view>
</template>

<script>
	import api from '@/http/api.js'
	import load from '@/components/load.vue'
	import subLoad from '@/components/sub.vue'
	import noData from '@/components/noData.vue'
	export default {
		components:{load,subLoad,noData},
		data() {
			return {
				showCont:false,
				showSub:false,
				showCodeMask:false,
				listArr:[],
				formData:{},
				codeInfo:{},
				codeId:'',
			};
		},
		methods: {
			moreFn() {
				uni.navigateTo({
					url: 'schoolRecord/schoolRecord'
				});
			},
			detailFn(item){
				uni.navigateTo({
					url: 'schoolRecord/schoolRecordDetail/schoolRecordDetail?id='+item.verification_record_id
				});
			},
			accountFn(){
				uni.navigateTo({
					url: 'schoolAccount/schoolAccount'
				});
			},
			subFn(){
				wx.scanCode({
				  success:(res)=> {
					// 扫码成功，获取结果
					console.log(res.result);
					// res.result 即为扫码得到的结果
					if(res.result&&res.result.split('=')[1]){
						this.getCodeInfo(res.result.split('=')[1])
					}
				  },
				  fail(err) {
					// 扫码失败处理
					console.log('scan code fail', err);
				  }
				})
			},
			getData(){
				api.getRequst({},'/api/School').then((res)=>{
					if(res.code==1){
						this.formData = res.data
					}
				})
			},
			getRecord(){
				api.getRequst({},'/api/School/jqVerificationRecord').then((res)=>{
					if(res.code==1){
						this.listArr = res.data
					}
					this.showCont = true
				})
			},
			getCodeInfo(id){
				api.getRequst({sign_id:id},'/api/School/verificationShow').then((res)=>{
					if(res.code==1){
						this.codeInfo = res.data
						this.codeId = id
						this.showCodeMask = true
					}
				})
			},
			sureCodeFn(){
				this.showSub = true
				api.getRequst({sign_id:this.codeId},'/api/School/verificationSign').then((res)=>{
					if(res.code==1){
						this.$refs.uToast.show({
							message:'核销成功',
						})
						this.showSub = false
						this.showCodeMask = false
						this.getData()
						this.getRecord()
					}
				})
			}
		},
		async onLoad(){
			await this.getData()
			this.getRecord()
		}
	}
</script>

<style lang="less">
.showCont{
	min-height: 100vh;
	padding-bottom:30rpx;
	box-sizing: border-box;
	padding-top: 30rpx;
	.headCont{
		background-color: #fff;
		padding: 30rpx 30rpx 50rpx;
		width: 92%;
		margin: 0 auto;
		border-radius: 15rpx;
		box-sizing: border-box;
		.schoolCont{
			display: flex;
			align-items: center;
			.schoolImg{
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
				font-size: 0;
				padding: 5rpx;
				// background-color: #3f55cc;
				box-sizing: border-box;
				image{
					width: 100%;
					height: 100%;
					border-radius: 50%;
				}
			}
			.schoolInfo{
				flex: 1;
				width: 100rpx;
				margin: 0 30rpx;
				.schoolName{
					font-size: 32rpx;
					font-weight: bold;
					display: flex;
					align-items: center;
					.accountTag{
						font-size: 20rpx;
						font-weight: normal;
						margin-left: 10rpx;
						background-color: #ff5757;
						color: #fff;
						padding: 5rpx 20rpx;
						border-radius: 5rpx;
					}
				}
				.schoolText{
					font-size: 24rpx;
					color: #666;
					margin-top: 7rpx;
					
				}
			}
			.editBtn{
				color: #3f55cc;
				font-size: 40rpx;
			}
		}
		.cardCont{
			width: 100%;
			display: flex;
			justify-content: space-between;
			margin-top: 50rpx;
			.cardItem{
				width: 50%;
				text-align: center;
				.cardName{
					font-size: 28rpx;
				}
				.cardNum{
					font-size: 44rpx;
					font-weight: bold;
					margin-bottom: 20rpx;
				}
			}
		}
		.subBtn{
			width: 100%;
			margin-top: 50rpx;
			box-sizing: border-box;
			padding: 30rpx;
			text-align: center;
			background-image: linear-gradient(to right bottom,#a3bffe,#3f55cc);
			color: #fff;
			border-radius: 100rpx;
			font-size: 30rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			.iconfont{
				margin-right: 15rpx;
				font-size: 36rpx;
			}
		}
	}
	.recordCont{
		width: 92%;
		padding: 30rpx 4% 20rpx;
		margin: 30rpx auto;
		background-color: #fff;
		border-radius: 10rpx;
		box-sizing: border-box;
		.recordHead{
			display: flex;
			justify-content: space-between;
			align-items: center;
			.recordTitle{
				font-size: 30rpx;
				font-weight: bold;
			}
			.recordMore{
				color: #666;
			}
		}
		.recordList{
			.workItem{
				padding: 30rpx 0;
				border-top:2rpx dashed #ddd;
				.workHead{
					display: flex;
					align-items: center;
					justify-content: space-between;
					.workName{
						width: 100rpx;
						font-size: 28rpx;
						font-weight: bold;
						flex: 1;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
						margin-right: 30rpx;
					}
					.workDes{
						font-size: 24rpx;
					}
				}
				.workInfo{
					.infoItem{
						display: flex;
						align-items: center;
						margin-top: 15rpx;
						justify-content: space-between;
						.infoName{
							width: 120rpx;
							margin-right: 15rpx;
							color: #666;
						}
						.infoText{
							.redText{
								color: #ff5757;
							}
						}
						
					}
				}
			}
			.noTop{
				border-top:none;
			}
		}
	}
}
.formCont{
	background-color: #fff;
	padding: 40rpx 4% 30rpx;
	width: 100%;
	box-sizing: border-box;
	.formTitle{
		font-size: 32rpx;
		margin-bottom: 40rpx;
		font-weight: bold;
		text-align: center;
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
	}
	.formDesItem{
		width: 100%;
		display: flex;
		margin-bottom: 20rpx;
		justify-content: space-between;
		.desName{
			color: #333;
			width: 120rpx;
			text-align: right;
			margin-right: 30rpx;
		}
		.desText{
			flex: 1;
			width: 100rpx;
			text-align: right;
		}
	}
	.ctrlGroup{
		width: 100%;
		margin-top: 30rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		.ctrlBtn{
			width: 48%;
			text-align: center;
			box-sizing: border-box;
			padding: 20rpx;
			font-size: 24rpx;
			// background-color: #f8f8f8;
			border: 1px solid #3f55cc;
			color: #3f55cc;
			border-radius: 10rpx;
		}
		.has_bg{
			background-color: #3f55cc;
			color: #fff;
		}
	}
}
</style>
